.listen_details1 .header {
  padding-top: 1.06666667rem;
  background: url("../../src/image/listenbook1-bg.jpg") no-repeat;
  background-size: 26.66666667rem, 38.93333333rem;
}
.listen_details1 .header .top {
  height: 3.12888889rem;
  overflow: hidden;
}
.listen_details1 .header .top i {
  display: block;
  float: left;
  width: 0.81777778rem;
  height: 1.49333333rem;
  margin-left: 1.99111111rem;
  margin-top: 0.81777778rem;
  background: url("../../src/image/listenbook-back1.png") no-repeat;
  background-size: 0.81777778rem, 1.49333333rem;
}
.listen_details1 .header .top span {
  display: block;
  float: right;
}
.listen_details1 .header .top .share {
  width: 1.35111111rem;
  height: 1.35111111rem;
  background: url("../../src/image/listenbook-share.png") no-repeat;
  background-size: 1.35111111rem, 1.35111111rem;
  margin-right: 2.09777778rem;
}
.listen_details1 .header .top .like {
  width: 1.42222222rem;
  height: 1.28rem;
  background: url("../../src/image/listenbook-like.png") no-repeat;
  background-size: 1.42222222rem, 1.28rem;
  margin-right: 1.42222222rem;
}
.listen_details1 .header .playbook {
  width: 24.96rem;
  margin: 0 auto;
  padding-top: 1.42222222rem;
  text-align: center;
  color: #ffffff;
}
.listen_details1 .header .playbook img {
  width: 8.53333333rem;
  height: 11.37777778rem;
}
.listen_details1 .header .playbook h2 {
  font-size: 1.13777778rem;
  margin-top: 2.56rem;
}
.listen_details1 .header .playbook h3 {
  font-size: 0.99555556rem;
  margin-top: 1.06666667rem;
}
.listen_details1 .header .playbook .icon {
  padding-top: 2.13333333rem;
  overflow: hidden;
}
.listen_details1 .header .playbook .icon i {
  display: block;
  float: left;
  width: 1.84888889rem;
  height: 1.84888889rem;
  text-align: center;
  margin-right: 4.26666667rem;
  padding-bottom: 2.56rem;
}
.listen_details1 .header .playbook .icon .manage {
  background: url("../../src/image/listenbook1-manage.png") no-repeat;
  background-size: 1.84888889rem, 1.84888889rem;
  margin-left: 5.58222222rem;
}
.listen_details1 .header .playbook .icon .reply {
  width: 2.13333333rem;
  height: 1.92rem;
  background: url("../../src/image/listenbook1-reply.png") no-repeat;
  background-size: 2.13333333rem, 1.92rem;
}
.listen_details1 .header .playbook .icon .list {
  width: 1.88444444rem;
  height: 1.77777778rem;
  background: url("../../src/image/listenbook1-list.png") no-repeat;
  background-size: 1.88444444rem, 1.77777778rem;
}
.listen_details1 .header .playbook .progress-bar {
  width: 24.96rem;
  height: 1.77777778rem;
  position: relative;
  padding-top: 0.39111111rem;
}
.listen_details1 .header .playbook .progress-bar span {
  display: block;
  width: 19.91111111rem;
  height: 0.14222222rem;
  background: #ffffff;
  margin: 0 auto;
}
.listen_details1 .header .playbook .progress-bar span:before {
  content: '';
  display: block;
  width: 1.20888889rem;
  height: 0.85333333rem;
  background: url("../../src/image/listenbook1-advance.png") no-repeat;
  background-size: 1.20888889rem, 0.85333333rem;
  position: absolute;
  top: 0rem;
  left: 0rem;
  margin-left: 0.60444444rem;
}
.listen_details1 .header .playbook .progress-bar span:after {
  content: '';
  display: block;
  width: 1.20888889rem;
  height: 0.85333333rem;
  background: url("../../src/image/listenbook1-retreat.png") no-repeat;
  background-size: 1.20888889rem, 0.85333333rem;
  position: absolute;
  top: 0rem;
  right: 0rem;
  margin-right: 0.60444444rem;
}
.listen_details1 .header .playbook .progress-bar b {
  display: block;
  position: absolute;
  left: 2.52444444rem;
  top: 0.71111111rem;
}
.listen_details1 .header .playbook .progress-bar i {
  right: 2.52444444rem;
  display: block;
  position: absolute;
  top: 0.71111111rem;
}
.listen_details1 .header .playbook .progress-bar em {
  display: block;
  position: absolute;
  width: 4.97777778rem;
  height: 0.42666667rem;
  background: url("../../src/image/listenbook1-bar.png") no-repeat;
  background-size: 4.97777778rem, 0.42666667rem;
  top: 0.21333333rem;
  left: 2.52444444rem;
}
.listen_details1 .header .play {
  margin-top: 1.77777778rem;
  overflow: hidden;
  padding-left: 2.02666667rem;
  font-size: 0.71111111rem;
  padding-bottom: 2.84444444rem;
}
.listen_details1 .header .play img {
  width: 1.92rem;
  height: 1.88444444rem;
  margin-bottom: 0.42666667rem;
}
.listen_details1 .header .play div {
  float: left;
  overflow: hidden;
  position: relative;
  height: 3.37777778rem;
}
.listen_details1 .header .play span {
  display: block;
  float: left;
  width: 1.13777778rem;
  height: 1.42222222rem;
}
.listen_details1 .header .play .prov {
  background: url("../../src/image/listenbook1-advance1.png") no-repeat;
  background-size: 1.13777778rem, 1.42222222rem;
  margin-left: 2.31111111rem;
  margin-right: 5.33333333rem;
  margin-top: 0.81777778rem;
}
.listen_details1 .header .play .next {
  background: url("../../src/image/listenbook1-retreat1.png") no-repeat;
  background-size: 1.13777778rem, 1.42222222rem;
  margin-right: 2.77333333rem;
  margin-left: 2.13333333rem;
  margin-top: 0.81777778rem;
}
.listen_details1 .header .play .playb {
  width: 3.12888889rem;
  height: 3.12888889rem;
  background: url("../../src/image/listenbook1-play.png") no-repeat;
  background-size: 3.12888889rem, 3.12888889rem;
  position: absolute;
  left: 50%;
  margin-left: -1.70666667rem;
}
.listen_details1 .header .play .pause {
  width: 3.12888889rem;
  height: 3.12888889rem;
  background: url("../../src/image/listenbook1-pause.png") no-repeat;
  background-size: 3.12888889rem, 3.12888889rem;
  position: absolute;
  left: 50%;
  margin-left: -1.70666667rem;
  display: none;
}
.listen_details1 .review-area {
  width: 24.96rem;
  margin: 0 auto;
}
.listen_details1 .review-area .com-title {
  overflow: hidden;
  font-size: 1.13777778rem;
  color: #666666;
}
.listen_details1 .review-area .com-title h2 {
  margin-left: 1.06666667rem;
  float: left;
  margin-bottom: 1.42222222rem;
}
.listen_details1 .review-area .com-title span {
  display: block;
  float: right;
  margin-right: 1.24444444rem;
  color: #67bfff;
}
.listen_details1 .review-area .com-title span:before {
  content: "";
  display: block;
  float: left;
  width: 0.85333333rem;
  height: 0.78222222rem;
  margin-right: 0.21333333rem;
  margin-top: 0.24888889rem;
  background: url("../../src/image/listenbook-write.png") no-repeat;
  background-size: 0.85333333rem, 0.78222222rem;
}
.listen_details1 .review-area .null {
  text-align: center;
}
.listen_details1 .review-area .null img {
  width: 5.68888889rem;
  height: 4.97777778rem;
}
